<section class="fa-section">
    <div class="fa-box">
        <fieldset class="layui-elem-field">
            <legend>文章评论</legend>
            <div class="layui-field-box">
                {volist name="comment_list" id="comment"}
                <div class="layui-row">
                    <div class="layui-col-xs2">个人主页：</div>
                    <div class="layui-col-xs10">{$comment.link}</div>
                </div>
                <div class="layui-row">
                    <div class="layui-col-xs2">评论：</div>
                    <div class="layui-col-xs10">{$comment.content|nl2br}</div>
                </div>
                <span class="fa-pull-right">{$comment.create_time}</span>
                <hr class="layui-bg-green">
                {/volist}
            </div>
        </fieldset>
        <div class="fa-text-center">
            {$comment_list->render()}
        </div>
    </div>
</section>
<div class="fa-box">
    <fieldset class="layui-elem-field layui-field-title">
        <legend>发表评论</legend>
        <div class="layui-field-box">
            <form id="fff" class="layui-form fa-ajax-form" enctype="multipart/form-data" action="{:url('index/comment/insert')}" method="post">
                <div class="layui-form-item">
                    <label class="layui-form-label">个人主页</label>
                    <div class="layui-input-block">
                        {:token()}
                        <input name="article_id" type="hidden" value="{$Request.route.article_id}"/>
                        <input type="text" name="link" required  lay-verify="required" placeholder="您的个人主页地址 请填写包含http://或https://的完整地址" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">您的评论</label>
                    <div class="layui-input-block">
                        <textarea name="content" placeholder="您的评论" class="layui-textarea"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-inline">
                        <img id="captcha" src="{:captcha_src()}">
                    </div>
                </div>
                <label class="layui-form-label">验证码</label>
                <div class="layui-input-block">
                    <input type="text" name="captcha" required lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-mid layui-word-aux"></div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                    </div>
                </div>
            </form>
        </div>
    </fieldset>
</div>
<script>
    layui.use(['layer'], function () {
        var layer = layui.layer;
        var $ = layui.$;

        /!*验证码刷新*!/
        var verify = document.getElementById('captcha');
        var url = verify.src;
        verify.addEventListener('click', function (e) {
            verify.src = url + '?' + (new Date).getSeconds();
        });

    })
</script>

